<template>
	<u-upload width="160" height="160" :form-data="queryOss" :action="action" :auto-upload="false" ref="uUpload"
	 max-count="1" :show-progress="false" :multiple="false" @on-choose-complete="changeImg()"></u-upload>
</template>

<script>
	import {
		ossimg
	} from '@/api/oss.js'
	export default{
		data() {
			return {
				action: '',
				dir: '',
				queryOss: {},
			}
		},
		created() {
			this.getOss()
		},
		props:['dirUrl'],
		methods:{
			getOss(){
				ossimg({
					dir: this.dirUrl
				}).then(res => {
					console.log(res);
					this.queryOss = res.result
					this.queryOss.OSSAccessKeyId = res.result.accessid
					const {
						host,
						OSSAccessKeyId,
						policy,
						signature,
						dir
					} = res.result
					this.queryOss = {
						'OSSAccessKeyId': OSSAccessKeyId,
						'policy': policy,
						'signature': signature,
						'success_action_status': '200',
					}
					this.action = res.result.host
					this.dir = dir
					console.log(this.action);
				})
			},
			changeImg(event) {
				let files = this.$refs.uUpload.lists;
				this.queryOss.Filename = files[0].file.name
				const imgFormat = files[0].url.split('/').pop().split('.')[1];
				const imgName = files[0].url.split('/').pop().split('.')[0];
				const imgMd5Name = this.$md5(imgName);
				this.queryOss.key = `${this.dir}${imgMd5Name}.${imgFormat}`
				let logoData = `${this.action}/${this.queryOss.key}`
				console.log(logoData);
				
				this.$emit('logo-cancel', logoData)
			},
			update(){
				this.$refs.uUpload.upload();
			}
		}
	}
</script>

<style>
</style>
